<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>01_初识vue</title>
    <script src="../js/vue.js"></script>
</head>
<body>


    <div class="container">
<!--    {{}} vue的语法模板   渲染数据 -->
<!--
        1、vue实例和容器一一对应
        2、vue中的双括号的引用为js的表达式
        3、Vue.config.devtools = true;使用开发者工具要开启此配置选项
 -->
        <h1>hello,{{name.toUpperCase()}}</h1>
    </div>
    <script>
        Vue.config.productionTip = false; //阻止vue生成启动时使用生产包的提示
        Vue.config.devtools = true;
        //创建一个vue实例,传入一个配置对象
        new Vue({
            el:'.container',//指定那个容器的vue实例,一般是选择器的字符串
            data:{//传入的数据,将数据渲染到哪个位置,只有本vue实例才能使用，暂时是一个对象
                name:'vue'
            }
        });

    </script>


</body>
</html>